<template>
	<view class="orderInform">
		<!--#ifdef H5-->
		<Header @back = "back()" left-icon="back" left-text="" right-text="" title="订票须知"></Header>
		<!--#endif-->
		<view class="orderInformContent">
			<!--门票概述-->
			<view class="content1">
				<view class="today-top">
					<view class="top-button">
						<text>今日票</text>
					</view>
					<text class="text-desc">16:00前可订票</text>
				</view>
				<view class="today-foot">
					<!-- <view class="foot-button" v-if="infos.canRefund == '1'">
						<text>随时退</text>
					</view> -->
					<view class="foot-button">
						<text>不可改退</text>
					</view>
					<view class="foot-desc">
						<text class="text-desc">{{infos.refundPolicy}}</text>
					</view>
				</view>
			</view>
			<!--费用说明-->
			<view class="price-info">
				<view class="title">
					<text>费用说明</text>
				</view>
				<view class="include">
					<view>
						<text>费用包含：</text>
					</view>
					<view>
						<text class="text-desc">{{infos.costInclude}}</text>
					</view>
					
				</view>
				<view class="not-include">
					<view>
						<text>费用不包含：</text>
					</view>
					<view>
						<text class="text-desc">其他二销产品</text>
					</view>
				</view>
			</view>
			<!--入园须知-->
			<view class="tips-info">
				<view class="title">
					<text>入园须知</text>
				</view>
				<view class="time">
					<view>
						<text class="text-tip">入园时间:</text>
					</view>
					<view>
						<text class="text-desc">{{infos.admissionStart}}</text>
					</view>
				</view>
				<view class="address">
					<view>
						<text class="text-tip">入场地点:</text>
					</view>
					<view>
						<text class="text-desc">{{infos.admissionAddress}}</text>
					</view>
				</view>
				<view class="ticket-time">
					<view>
						<text class="text-tip">取票时间:</text>
					</view>
					<view>
						<text v-if="infos.takeStart && infos.takeEnd" class="text-desc">{{infos.takeStart}}—{{infos.takeEnd}}</text>
					</view>
				</view>
				
				<view class="ticket-address">
					<view>
						<text class="text-tip">取票地点:</text>
					</view>
					<view>
						<text class="text-desc">{{infos.getTicketPlace}}</text>
					</view>
				</view>
				<view class="usetime">
					<view>
						<text class="text-tip">有效期:</text>
					</view>
					<view>
						<text class="text-desc">{{infos.effectiveDesc}}</text>
					</view>
				</view>
			</view>
			<view class="price-desc">
				<view class="title">
					<text>门市价</text>
				</view>
				<view class="desc">
					<text class="text-desc">
						此门市价是指景区/商家对应票种/商品的门市官方售卖价（景区或商家门市买赠、促销、短期内自行降价等活动及法定优惠的价格除外）
					</text>
				</view>
			</view>
			<view class="important">
				<view class="title">
					<text>重要须知</text>
				</view>
				<view class="desc">
					<text class="text-desc">
						{{infos.importantInfo}}
					</text>
				</view>
			</view>
			<!-- <block v-for="(item,index) in infos" :key='index'>
				<view v-if="item.value.length>0" class="sign">
					【{{item.key}}】
				</view>
				<view v-if="item.value.length>0" class="describe">
					{{item.value}}
				</view>
			</block> -->
		</view>
		<!-- <view class="submitBtn" @click="submitOrder">
			立即预订
		</view> -->
	</view>
</template>

<script>
	import Header from '@/components/header.vue';
	import Time from '../../common/js/DateFormat.js';
	export default {
		onLoad: function(option) {
			var that = this;
			uni.getStorage({
				key:'ticket',
				success:function(res){
					console.log('门票传过来的参数==========',res.data);
					that.parentDate = res.data;
					that.infos = res.data;
				}
			})
			console.log("this.infos---------->",this.infos)
			
		},
		data() {
			return {
				infos: [],
				resDate: '',
				parentDate: '',
			}
		},
		components: {
			Header
		},
		onShow() {
			//#ifdef H5
			document.title = '订票须知'
			//#endif
			
			// this.getData()
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				});
			},
			//提交
			submitOrder() {
				uni.navigateTo({
					url: './bookticket?item=' + JSON.stringify(this.parentDate),
					animationType: 'pop-in',
					animationDuration: 200
				});
			},
			getData() {
				this.$postApi(this.$path.GET_SPOT_TICKET_INFO, {
					id: this.parentDate.id,
				}).then(data => {
					console.log(data)
					data = data.data;
					let admissionAddress = '';
					let takeAddress = '';
					if (data.objData.admissionAddress && data.objData.admissionAddress.length > 0) {
						admissionAddress = '\n入场地点：' + data.objData.admissionAddress
					}
					if (data.objData.takeAddress && data.objData.takeAddress.length > 0) {
						takeAddress = '\n取票地点：' + data.objData.takeAddress
					}
					this.infos = data.objData;
					this.infos.price = this.parentDate.price;
					let time = new Time();
					this.infos.validDate = time.setTime(this.infos.validDate,'yymmdd').toString('yyyy-mm-dd');
					// var infos = [{
					// 	key: '门票',
					// 	value: data.objData.name
					// }, {
					// 	key: '使用方法',
					// 	value: data.objData.instructions
					// }, {
					// 	key: '入场须知',
					// 	value: "入场时间：" + data.objData.admissionStart + "-" + data.objData.admissionEnd + admissionAddress + "\n取票时间：" +
					// 		data.objData.takeStart + "-" + data.objData.takeEnd + takeAddress
					// }, {
					// 	key: '有效期',
					// 	value: data.objData.validDate
					// }, {
					// 	key: '重要须知',
					// 	value: data.objData.importantInfo
					// }, {
					// 	key: '退票规则',
					// 	value: data.objData.refundPolicy
					// }, {
					// 	key: '退改须知',
					// 	value: data.objData.changeRule
					// }/*, {
					// 	key: '退改规则',
					// 	value: data.objData.rules ? data.objData.rules.replace(new RegExp("&&", "gm"), "\n") : ""
					// }, {
					// 	key: '其他规则',
					// 	value: data.objData.otherRule ? data.objData.otherRule.replace(new RegExp("&&", "gm"), "\n") : ""
					// }*/, {
					// 	key: '费用包含',
					// 	value: data.objData.costInclude ? data.objData.costInclude.replace(new RegExp("&&", "gm"), "\n") : ""
					// }, {
					// 	key: '通关时间限制',
					// 	value: data.objData.passTimeLimit ? data.objData.passTimeLimit.replace(new RegExp("&&", "gm"), "\n") : ""
					// }, {
					// 	key: '重要提示',
					// 	value: data.objData.importantNotice ? data.objData.importantNotice.replace(new RegExp("&&", "gm"), "\n") : ""
					// }];

					// this.infos = infos
					console.log("门票详情------------------->", this.infos);
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.orderInform {
		font-size: 26upx;
		height: 100%;
		// padding: 20upx;
		.orderInformContent {
			padding: 43upx;
			// padding-top: 100upx;
			margin-bottom: 110upx;

			.sign {
				border-top: 1upx solid #F5F5F5;
				padding-top: 50upx;
				font-size: 32upx;
				font-weight: 500;
				color: rgba(51, 51, 51, 1);
			}

			.sign:first-child {
				border-top: 0;
			}

			.describe {
				font-size: 30upx;
				font-weight: 400;
				line-height: 45upx;
				color: rgba(51, 51, 51, 1);
				margin: 15upx 0;
			}
		}
		.content1{
			//#ifdef H5
			margin-top: 80upx;
			//#endif
			font-size: 25upx;
			height: 180upx;
			border-bottom: 1px solid #eee;
		}
		.today-top,.today-foot{
			display: flex;
			flex-direction: row;
			flex-wrap: nowrap;
			margin-top:30upx;
			
		}
		.top-button,.foot-button{
				margin-right: 40upx;
				width: 120upx;
				height: 40upx;
				text-align: center;
				color: dodgerblue;
				border:1px solid dodgerblue;
				border-radius: 12upx;
		}
		.foot-desc{
			width: 80%;
			font-size: 25upx;
			font-weight: 300;
			height: 40upx;
			line-height: 35upx;
		}
		.title{
				font-weight: bold;
				font-size: 30upx;
			}
		.price-info{
			display: flex;
			flex-direction: column;
			justify-content: space-around;
			// height: 240upx;
			padding: 32upx 0 32upx 0;
			border-bottom: 1px solid #eee;
			
			.include,.not-include{
				margin-top: 20upx;
				display: flex;
				flex-direction: row;
				
				view:first-child{
					width:180upx;
					
					color: #aaa;
				}
				view:last-child{
					width: 80%;
					line-height: 40upx;
				}
				
			}
		}
		.text-tip{
			color: #aaa;
		}
		.text-desc{
			font-size:26upx;
			color: dimgrey
			// font-weight: 400;
		}
		.tips-info{
			padding: 20upx 0 20upx 0;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
			height: 500upx;
			border-bottom: 1px solid #eee;
			.time,.address,.ticket-time,.ticket-address,.usetime{
				display: flex;
				flex-direction: row;
				
				view:first-child{
					// text-align: center;
					width:180upx;
					// color: #aaa;
				}
				view:last-child{
					display: flex;
					flex-direction: column;
					justify-content: center;
					// align-content: center;
					width: 80%;
				}
			}
		}
		.price-desc,.important{
			padding: 30upx 0 30upx 0;
			
		}
		.desc{
				margin-top: 20upx;
				padding-right:30upx; 
				line-height: 50upx;
			}
		.submitBtn {
			position: fixed;
			bottom: 0;
			width: 100%;
			height: 110upx;
			line-height: 110upx;
			font-size: 36upx;
			text-align: center;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
			background: #108EE9
		}
	}
</style>
